import React, { Component } from 'react';
import '../styles/Request.css'
import { user_register } from '../api/login';
class Register extends Component {
    constructor(props) {
        super(props)
        this.state = {
            phone: '',
            pass:""
        }
    }
    changeCount(e) {
        this.setState({
           [ e.target.name]:e.target.value
        })
    }
    register() {
        console.log(this.state)
        let aa = /^1[35789]\d{9}$/
        let reg = /^[a-zA-Z0-9_-]{4,16}$/;
        if (!this.state.phone || !this.state.pass) {
            alert("号码/密码不能为空")
        } else {
            if (!aa.test(this.state.phone)||!this.state.phone ) {
                alert("请输入正确的手机号")
            } else if(!reg.test(this.state.pass)){
                alert("请输入至少4位密码")
            } else {
                user_register({ phone: this.state.phone, pass: this.state.pass }).then(res => {
                    console.log(res)
        
                    if (res.data.code == 400) {
                            alert('该号码已被注册')
                    } else { 
                        alert("注册成功")
                        localStorage.setItem("phone",this.state.phone)
                        localStorage.setItem("pass", this.state.pass)
                        this.props.history.push('/login')
                    }
                })
            }
        }
        
        
    }
    // componentDidMount() {
    //     user_register({ phone: this.state.phone, pass: this.state.pass }).then(res => {
    //         console.log(res)
    //     })
    // }
    render() {
        return (
            <div className='login'>
                <div className='lo_box'>
                <input  name='phone' value={this.state.value} onChange={(e)=>{this.changeCount(e)}} type="text" placeholder='请输入手机号' /><br />
                <input name='pass' value={this.state.pass} onChange={(e)=>{this.changeCount(e)}} type="password" placeholder='请输入密码' />
               
                <div className='btn'>
                        <button onClick={()=>{this.register()}}>注册</button>
                </div>
                
                </div>
                 </div>
        );
    }
}

export default Register;